<template>
  <div class="vehicle-details-wrap">
    <div class="box">
      <TopFilter
        ref="searchOrdersPanel"
        :list="searchOrdersList"
        :isSubmitBtn="true"
        :cols="4"
        :label-width="90"
        @filterChange="getOrderList"
        @onCollapse="collapseHandle"
      />
      <!-- <el-row>
        <el-button @click="query" type="primary" >查 询</el-button>
        <el-button @click="reset" >重 置</el-button>
      </el-row> -->
       <!--  :loading="addBtnState" -->
    </div>
    <FilterTable
      ref="table"
      :columns="columns"
      :fetchapi="fetchApi"
      :params="fetchParams"
      selectionType="multiple"
      :datakey="'rows'"
      :onColumnsChange="columns => this.columns = columns"
      :onRowSelectChange="arr => this.onChangeColumn = arr"
    >
      <template slot="controls">
        <!-- <el-button @click="openPayments" type="primary" >收 款</el-button> -->
      </template>
    </FilterTable>
  </div>
</template>

<script>
import moment from 'moment';
import { dictionary } from '@/utils/dictMixin';
import { getOrderList } from '@/api/finance/repair/receivables';



export default {
  name: 'ownerInformation',
  mixins: [dictionary],
  data() {
    // this.dmsFunc = { dmsFuncId: 55100010 };
    return {
      searchOrdersList: this.createSearchOrdersList(),
      columns: this.createTableColumns(),
      fetchParams: { },
      fetchApi: getOrderList,
      onChangeColumn: [],
    };
  },
  components: {},
  computed: {},
  watch: {},
  methods: {
    createSearchOrdersList() {
      return [
        {
          type: 'INPUT',
          label: '工单号',
          fieldName: 'roNo'
        },
        {
          type: 'SELECT',
          label: '是否结清',
          fieldName: 'payOff',
          itemList: this.createDictList('1004')
        }
      ];
    },
    createTableColumns(){
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 50,
          fixed: 'left',
          render: props => {
            return (
              <div>
                <el-button size="mini" type="text">
                  操作
                </el-button>
              </div>
            );
          }
                // <el-divider direction="vertical" />
                // <el-button size="mini" type="text" onClick={()=>this.detail(props.row)}>
                //   明细
                // </el-button>
                // <el-divider direction="vertical" />
                // <el-button size="mini" type="text" disabled={props.row.lockFlag === 10041002} onClick={()=>this.removelock(props.row.employeeId)}>
                //   解锁
                // </el-button>
                // <el-divider direction="vertical" />
                // <el-button size="mini" type="text" disabled={props.row.lockFlag === 10041001} onClick={()=>this.lock(props.row.employeeId)}>
                //   锁定
                // </el-button>
        },
        {
          title: 'VIN',
          dataIndex: 'VIN',
          width: 150,
          sorter: true,
        },
        {
          title: '车牌号',
          dataIndex: 'LICENSE',
          sorter: true,
        },
        {
          title: '发动机号',
          dataIndex: 'ENGINE_NO',
          sorter: true,
        },
        {
          title: '品牌',
          dataIndex: 'BRAND',
          sorter: true,
        },
        {
          title: '车系',
          dataIndex: 'SERIES',
          sorter: true,
        },
        {
          title: '车型',
          dataIndex: 'MODEL',
          sorter: true,
        },
        {
          title: '配置',
          dataIndex: 'APACKAGE',
          sorter: true,
        },
        {
          title: '车型年',
          dataIndex: 'MODEL_YEAR',
          sorter: true,
        },
        {
          title: '颜色',
          dataIndex: 'COLOR',
          sorter: true,
        },
        {
          title: '服务专员',
          dataIndex: 'SERVICE_ADVISOR',
          sorter: true,
        },
        {
          title: '是否本公司购车',
          dataIndex: 'IS_SELF_COMPANY',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.IS_SELF_COMPANY, '1004')}</span>;
          }
        },
        {
          title: '固定资产编号',
          dataIndex: 'CAPITAL_ASSERTS_MANAGE_NO',
          sorter: true,
        },
        {
          title: 'VIP编号',
          dataIndex: 'VIP_NO',
          sorter: true,
        },
        {
          title: '经销商',
          // dataIndex: 'dealer',
          sorter: true,
        },
        {
          title: '销售日期',
          dataIndex: 'SALES_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '上牌日期',
          dataIndex: 'LICENSE_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '行驶里程',
          dataIndex: 'MILEAGE',
          sorter: true,
        },
        {
          title: '保修起始日期',
          dataIndex: 'WRT_BEGIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '保修起始里程',
          dataIndex: 'WRT_BEGIN_MILEAGE',
          sorter: true,
        },
        {
          title: '送修人姓名',
          dataIndex: 'DELIVERER',
          sorter: true,
        },
        {
          title: '送修人性别',
          dataIndex: 'DELIVERER_GENDER',
          sorter: true,
        },
        {
          title: '送修人电话',
          dataIndex: 'DELIVERER_PHONE',
          sorter: true,
        },
        {
          title: '送修人手机',
          dataIndex: 'DELIVERER_MOBILE',
          sorter: true,
        },
        {
          title: '送修人地址',
          dataIndex: 'DELIVERER_ADDRESS',
          sorter: true,
        },
        {
          title: '车辆备注',
          dataIndex: 'REMARK',
          sorter: true,
        },
        {
          title: '车主编号',
          dataIndex: 'OWNER_NO',
          sorter: true,
        },
        {
          title: '车主性质',
          dataIndex: 'OWNER_PROPERTY',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.OWNER_PROPERTY, '8011')}</span>;
          }
        },
        {
          title: '车主',
          dataIndex: 'OWNER_NAME',
          sorter: true,
        },
        {
          title: '性别',
          dataIndex: 'GENDER',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.GENDER, '8012')}</span>;
          }
        },
        {
          title: '所在行业大类',
          dataIndex: 'INDUSTRY_FIRST',
          sorter: true,
        },
        {
          title: '所在行业二类',
          dataIndex: 'INDUSTRY_SECOND',
          sorter: true,
        },
        {
          title: '省份',
          dataIndex: 'PROVINCE',
          sorter: true,
        },
        {
          title: '城市',
          dataIndex: 'CITY',
          sorter: true,
        },
        {
          title: '区县',
          dataIndex: 'DISTRICT',
          sorter: true,
        },
        {
          title: '地址',
          dataIndex: 'ADDRESS',
          sorter: true,
        },
        {
          title: '邮编',
          dataIndex: 'ZIP_CODE',
          sorter: true,
        },
        {
          title: '电话',
          dataIndex: 'PHONE',
          sorter: true,
        },
        {
          title: '手机',
          dataIndex: 'MOBILE',
          sorter: true,
        },
        {
          title: '出生日期',
          dataIndex: 'BIRTHDAY',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: 'E_MAIL',
          dataIndex: 'E_MAIL',
          sorter: true,
        },
        {
          title: '家庭月收入',
          dataIndex: 'FAMILY_INCOME',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.FAMILY_INCOME, '8017')}</span>;
          }
        },
        {
          title: '婚姻状况',
          dataIndex: 'OWNER_MARRIAGE',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.OWNER_MARRIAGE, '8018')}</span>;
          }
        },
        {
          title: '学历',
          dataIndex: 'EDU_LEVEL',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.EDU_LEVEL, '8019')}</span>;
          }
        },
        {
          title: '联系人',
          dataIndex: 'CONTACTOR_NAME',
          sorter: true,
        },
        {
          title: '联系人性别',
          dataIndex: 'CONTACTOR_GENDER',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.CONTACTOR_GENDER, '8012')}</span>;
          }
        },
        {
          title: '联系人电话',
          dataIndex: 'CONTACTOR_PHONE',
          sorter: true,
        },
        {
          title: '联系人手机',
          dataIndex: 'CONTACTOR_MOBILE',
          sorter: true,
        },
        {
          title: '联系人省份',
          dataIndex: 'CONTACTOR_PROVINCE',
          sorter: true,
        },
        {
          title: '联系人城市',
          dataIndex: 'CONTACTOR_CITY',
          sorter: true,
        },
        {
          title: '联系人详细地址',
          dataIndex: 'CONTACTOR_ADDRESS',
          sorter: true,
        },
        {
          title: '联系人邮编',
          dataIndex: 'CONTACTOR_ZIP_CODE',
          sorter: true,
        },
        {
          title: '车主备注',
          dataIndex: 'REMARK',
          sorter: true,
        },
        {
          title: '上次进厂日期',
          dataIndex: 'LAST_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '预计下次保养日期',
          dataIndex: 'NEXT_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '上次维修里程',
          dataIndex: 'LAST_MAINTAIN_MILEAGE',
          sorter: true,
        },
        {
          title: '下次保养里程',
          dataIndex: 'NEXT_MAINTAIN_MILEAGE',
          sorter: true,
        },
        {
          title: '第一次进厂日期',
          dataIndex: 'FIRST_IN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '预收款',
          dataIndex: 'PRE_PAY',
          sorter: true,
        },
        {
          title: '欠款金额',
          dataIndex: 'ARREARAGE_AMOUNT',
          sorter: true,
        },
        {
          title: '优惠模式',
          dataIndex: 'DISCOUNT_MODE_CODE',
          sorter: true,
        },
        {
          title: '优惠截止日期',
          dataIndex: 'DISCOUNT_EXPIRE_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '钥匙号',
          dataIndex: 'KEY_NUMBER',
          sorter: true,
        },
        {
          title: '进厂台次',
          dataIndex: 'CAR_TAICI',
          sorter: true,
        },
        {
          title: '爱好',
          dataIndex: 'HOBBY',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.HOBBY, '8020')}</span>;
          }
        },
        {
          title: '销售顾问',
          dataIndex: 'CONSULTANT',
          sorter: true,
        },
        {
          title: '是否激活',
          dataIndex: 'IS_VALID',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.IS_VALID, '1004')}</span>;
          }
        },
        {
          title: '决策人E_MAIL',
          dataIndex: 'DECISION_MARKER_E_MAIL',
          sorter: true,
        },
        {
          title: '下次验车日期',
          dataIndex: 'NEXT_INSPECT_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '营运证日期',
          dataIndex: 'BUSINESS_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '车辆建档日期',
          dataIndex: 'FOUND_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '证件类型',
          dataIndex: 'CT_CODE',
          sorter: true,
          render: props => {
            return <span>{this.createDictText(props.row.CT_CODE, '8013')}</span>;
          }
        },
        {
          title: '证件号码',
          dataIndex: 'CERTIFICATE_NO',
          sorter: true,
        },
        {
          title: '保险公司',
          dataIndex: 'INSURATION_CODE',
          sorter: true,
        },
        {
          title: '保单号',
          dataIndex: 'INSURANCE_BILL_NO',
          sorter: true,
        },
        {
          title: '投保金额',
          dataIndex: 'ACTUAL_EXPENDING',
          sorter: true,
        },
        {
          title: '保险起始日期',
          dataIndex: 'INSURANCE_BEGIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '保险结束日期',
          dataIndex: 'INSURANCE_END_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '上次保养日期',
          dataIndex: 'LAST_MAINTENANCE_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '置换意向车型',
          dataIndex: 'REPLACE_INTENT_MODEL',
          sorter: true,
        },
        {
          title: '置换日期',
          dataIndex: 'REPLACE_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '重购意向车型',
          dataIndex: 'REBUY_INTENT_MODEL',
          sorter: true,
        },
        {
          title: '重购日期',
          dataIndex: 'REBUY_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '首保日期',
          dataIndex: 'FIRST_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '首保里程',
          dataIndex: 'FIRST_MAINTAIN_MILEAGE',
          sorter: true,
        },
        {
          title: '二保日期',
          dataIndex: 'SECOND_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '自费维修金额',
          dataIndex: 'REPAIR_AMOUNT',
          sorter: true,
        },
        {
          title: '自费工时费',
          dataIndex: 'LABOUR_AMOUNT',
          sorter: true,
        },
        {
          title: '自费维修材料费',
          dataIndex: 'REPAIR_PART_AMOUNT',
          sorter: true,
        },
        {
          title: '创建人',
          dataIndex: 'EMPLOYEE_NAME',
          sorter: true,
        },
        {
          title: '上次保养里程',
          dataIndex: 'LAST_MAINTENANCE_MILEAGE',
          sorter: true,
        },
        {
          title: '年行驶里程',
          dataIndex: 'DAILY_AVERAGE_MILEAGE',
          sorter: true,
        },
        {
          title: '上一次接待的服务顾问',
          dataIndex: 'LAST_SERVICE_ADVISOR',
          sorter: true,
        },
        {
          title: '上次维修经销商',
          dataIndex: 'LAST_REPAIR_ENTITY',
          sorter: true,
        },
        {
          title: '会员卡等级',
          dataIndex: 'CARD_TYPE_CODE',
          sorter: true,
        },
        {
          title: '首次非首保保养日期',
          dataIndex: 'FIRST_NONFIRST_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
        {
          title: '最后一次进厂日期',
          dataIndex: 'LAST_MAINTAIN_DATE',
          sorter: true,
          dateFormat: 'yyyy-MM-dd'
        },
      ]
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.$refs.table.$refs.pageTable.EXECUTE_RESET_HEIGHT();
      });
    },
    async getReceiveDetail(id) {
      const res = await getReceiveDetail(id);
      // console.log(res,'结清')
      this.showWriteOff = true
      this.$nextTick(()=>{
        this.$refs.writeOff.openModel(this.onChangeColumn, res.data)
      })
    },
    getOrderList (val){
      this.fetchParams = Object.assign({}, val);
    },
  },
  mounted() {
    // this.query()
  }
};
</script>

<style lang="less">
</style>
